<template>
    <!--srcviewsindexvuehtmlStart-->

    <div id="defaultId1" class="                    u66n4ZP">
        <div id="标题" class="                    uGp5b1M">
            <div id="gb7dd8" class="                     u0dd63">
                <strong id="gf1894" class="                     u98a49">调兵山市领导干部成长档案信息系统
                </strong>
            </div>
        </div>
        <div id="六个选项" class="                     u76541">
            <el-button-group id="c589bd" class="                    u6f2ce">
                <el-button id="c4360b" class="                    u4482e" type="primary">综合分析
                </el-button>
                <el-button id="c79afd" class=" u4482e                   " type="primary">干部画像
                </el-button>
                <el-button id="ca351f" class=" u4482e                   " type="primary">领导班子
                </el-button>
                <el-button id="c51093" class=" u4482e                   " type="primary">监督预警
                </el-button>
                <el-button id="c49f2d" class=" u4482e                   " type="primary">数据维护
                </el-button>
                <el-button id="ca5a96" class=" u4482e                   " type="primary">查询分析
                </el-button>
            </el-button-group>
        </div>
        <div id="调兵山" class="                     u95242">
            <div id="c7798f" class="                     ue9802">调兵山市
            </div>
        </div>
        <div id="副科级" class="                     u95241">
            <div id="cd958d" class="  ue9802                   ">副科级
            </div>
        </div>
        <div id="正科" class="                     u95243">
            <div id="g1e980" class="  ue9802                   ">正科级
            </div>
        </div>
        <div id="结构分析" class="                     u7b67a">
            <span id="g373b8" class="                     ue22ad">·结构分析
            </span>
            <button id="c87dfe" class="                     gui-button" type="button">年龄结构
            </button>
            <button id="c3bbbd" class="  gui-button                   " type="button">干部级别
            </button>
            <button id="c8a73c" class="  gui-button                   " type="button">文化程度
            </button>
            <button id="c7635f" class="  gui-button                   " type="button">职称
            </button>
            <button id="cbf632" class="  gui-button                   " type="button">专业
            </button>
            <button id="ca2d96" class="  gui-button                   " type="button">政治面貌/性别/民族
            </button>
        </div>
        <div id="概况" class="                    uc7f8vi">
            <h3 id="c4b37b" class="                    ucxaadn">· 概况
            </h3>
            <ul id="c87396" class="                    ucglkda">
                <li id="cee028" class="                    uc245v6">
                    <span id="c0e7a7" class="                    ucsijiz">总人数XX人
                    </span>
                </li>
                <li id="c63381" class=" uc245v6                     ">
                    <span id="c3f0a1" class=" ucsijiz                     ">正科级领导干部98人
                    </span>
                </li>
                <li id="ca2266" class=" uc245v6                     ">
                    <span id="c2a082" class=" ucsijiz                     ">副科级领导干部288人
                    </span>
                </li>
                <li id="c937b2" class=" uc245v6                     ">
                    <span id="cef96b" class=" ucsijiz                     ">专业型干部63人
                    </span>
                </li>
                <li id="c1677a" class=" uc245v6                     ">
                    <span id="c874ba" class=" ucsijiz                     ">优秀中层64人
                    </span>
                </li>
                <li id="c157ac" class=" uc245v6                     ">
                    <span id="cd5e80" class=" ucsijiz                     ">年轻干部116人
                    </span>
                </li>
            </ul>
        </div>
        <div id="饼状图" class="            uQ3VtkV">
            <charts id="c06315" class="            u148b9" ref="chatPie" :data="chatPie">aaaa
            </charts>
        </div>
        <div id="年龄分析" class="            u2d296">
            <div id="c0f9b5" class="def123           uce16e22">
                <div id="c1dca8" class="              ubba7d">
                    <div id="cb6354" class="12 12            u45e72">数据库的小于40的人数
                    </div>
                </div>
                <div id="c9d2bf" class="  ubba7d            u7a5f3">
                    <div id="c358a0" class="defBor2             u45e7223">数据库的41-45的人数
                    </div>
                </div>
                <div id="c80de7" class="  ubba7d            ">
                    <div id="cc0932" class=" 1 u45e721            unUaJ5K">数据库的46-50岁的人数
                    </div>
                </div>
                <div id="ca0c20" class="  ubba7d            ">
                    <div id="cc41f2" class="  u45e72            ">数据库的51-55岁的人数
                    </div>
                </div>
                <div id="c48d32" class="  ubba7d            ">
                    <div id="ca62d4" class="  u45e72            ">数据库的55岁以上的人数
                    </div>
                </div>
            </div>
            <img id="g2fd44" class="            u7933e" src="http://mms0.baidu.com/it/u=1018150019,2454913492&fm=253&app=138&f=JPEG?w=252&h=280" alt="guiplan官网" />
            <img id="g4fc3e" class="            uccdcc" src="https://img.mp.itc.cn/upload/20170214/0a80731a7bec4d7c8e32bef4b06fce6a.png" alt="guiplan官网" />
            <img id="g36867" class="            u2b544" src="http://mms1.baidu.com/it/u=3320977637,681660770&fm=253&app=138&f=JPEG?w=500&h=500" alt="guiplan官网" />
            <img id="g2bc02" class="            u17460" src="http://mms1.baidu.com/it/u=2646630282,3376036090&fm=253&app=138&f=JPEG?w=300&h=300" alt="guiplan官网" />
            <img id="g8463a" class="            u118c8" src="http://mms0.baidu.com/it/u=654294147,3505794696&fm=253&app=138&f=PNG?w=119&h=147" alt="guiplan官网" />
            <div id="gf5234" class="            ue79c9">
                <div id="g16750" class="  ubba7d          ">
                    <div id="gb5109" class="12 u45e7212          uADxijh">40岁以下
                    </div>
                </div>
                <div id="c6bdf6" class="  ubba7d          ">
                    <div id="c62eeb" class="defBor2 u45e7223          ">41-45岁
                    </div>
                </div>
                <div id="cc2da3" class="  ubba7d          uwUaDSt">
                    <div id="ca73e2" class=" 1 u45e721          uE4rdaZ">46-50岁
                    </div>
                </div>
                <div id="c5b79f" class="  ubba7d          u3ftJNu">
                    <div id="cc53c5" class="  u45e72          ">51-55岁
                    </div>
                </div>
                <div id="cbcb35" class="  ubba7d          ">
                    <div id="cfbb0c" class="  u45e72          ">55岁以上
                    </div>
                </div>
            </div>
        </div>
        <div id="gd7468" class="           uf7b02">
            <div id="c66e78" class="                     fenxi">
                <span id="c0b816" class="            ue22ad         ">·结构分析
                </span>
                <button id="c8616a" class="            gui-button         " type="button">人员规模
                </button>
                <button id="ca2ded" class="  gui-button                   " type="button">本科及以上学历
                </button>
                <button id="c35901" class="  gui-button                   " type="button">高职称人数
                </button>
                <button id="c4b1ab" class="  gui-button                   " type="button">梯队建设
                </button>
                <button id="c7f128" class="  gui-button                   " type="button">干部变任
                </button>
                <button id="ce6e2b" class="  gui-button                   " type="button">干部考核
                </button>
            </div>
        </div>
        <div id="g8a9e1" class="        u38b54">
            <charts id="cb28ad" ref="category1" :data="category1" width="100%" height="100%">矩形图组件
            </charts>
        </div>
        <div id="g789b8" class="           u8a48e">
            <div id="g78f31" class="        u8f3cf">
                <span id="g9299b" class="        ud5add">·退休分析
                </span>
            </div>
            <div id="gc8bf5" class="        ud532f">
                <charts id="c61934" class="   uZXvl9C" ref="category1" :data="category1" width="100%" height="100%">矩形图组件
                </charts>
            </div>
        </div>
        <div id="c9ff3f1" class="           u8a48e2">
            <div id="cbe54d" class="        u8f3cf2">
                <span id="c3ca09" class="     ud5add   ">·提拔时长分析
                </span>
            </div>
            <div id="c50c3c" class="     ud532f   ">
                <charts id="caa5f9" ref="chatBar" :data="chatBar" height="100%">矩形图组件
                </charts>
            </div>
        </div>
    </div>
    <!--srcviewsindexvuehtmlEnd-->

</template>
<script>
    import charts from '@/components/charts';
    export default {

        methods: {
            // insertMethod
            // srcviewsindexvueMethodStart
            // chartLineUpdate
            chartLineUpdate(x = ["数据一", "数据二", "数据三", "数据四"], y = [30, 90, 100, 60]) {







                var chartLine = this.chartLine;
                chartLine.series[0].data = y;
                chartLine.xAxis[0].data = x;
                this.$refs.chartLine.update();







            }, // chatPieUpdate
            chatPieUpdate(x = ["数据一", "数据二", "数据三", "数据四"], y = [30, 90, 100, 60]) {











                var chatPie = this.chatPie;
                chatPie.series[0].data = y;
                chatPie.xAxis[0].data = x;
                this.$refs.chatPie.update();











            }, // chatStackedUpdate
            chatStackedUpdate(x = ["数据一", "数据二", "数据三", "数据四"], y = [30, 90, 100, 60]) {










                var chatStacked = this.chatStacked;
                chatStacked.series[0].data = y;
                chatStacked.xAxis[0].data = x;
                this.$refs.chatStacked.update();










            }, // category1Update
            category1Update(x = ["数据一", "数据二", "数据三", "数据四"], y = [30, 90, 100, 60]) {




                var category1 = this.category1;
                category1.series[0].data = y;
                category1.xAxis[0].data = x;
                this.$refs.category1.update();




            }, // chatBarUpdate
            chatBarUpdate(x = ["数据一", "数据二", "数据三", "数据四"], y = [30, 90, 100, 60]) {



                var chatBar = this.chatBar;
                chatBar.series[0].data = y;
                chatBar.xAxis[0].data = x;
                this.$refs.chatBar.update();



            }
            // srcviewsindexvueMethodEnd

        },
        props: {
            // srcviewsindexvuePropsStart

            // srcviewsindexvuePropsEnd

            // srcviewszonghefenxiindexvuePropsStart

            // srcviewszonghefenxiindexvuePropsEnd

            // indexvuePropsStart

            // indexvuePropsEnd





        },
        async mounted() {


        },
        components: {


            // charts start
            charts,
            // charts end












        },
        data() {
            return {
                // insertData
                // srcviewsindexvueDataStart

                // chatPie
                chatPie: {
                    "title": {
                        "text": "政府工作部门及事业单位",
                        "x": "center",
                        "end": ""
                    },
                    "tooltip": {
                        "trigger": "item",
                        "formatter": "{a} <br/>{b} : {c} ({d}%)"
                    },
                    "legend": {
                        "orient": "vertical",
                        "left": "left",
                        "data": ["群团工作部门", "党委工作部门", "事业单位"]
                    },
                    "series": [{
                        "type": "pie",
                        "radius": "55%",
                        "center": ["50%", "40%"],
                        "data": [{
                            "value": 335,
                            "name": "群团工作部门"
                        }, {
                            "value": 310,
                            "name": "党委工作部门"
                        }, {
                            "value": 234,
                            "name": "事业单位"
                        }],
                        "itemStyle": {
                            "emphasis": {
                                "shadowBlur": 10,
                                "shadowOffsetX": 0,
                                "shadowColor": "rgba(0, 0, 0, 0.5)"
                            }
                        }
                    }]
                },
                // category1
                category1: {
                    "xAxis": {
                        "type": "category",
                        "data": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
                    },
                    "grid": {
                        "top": "0%",
                        "left": "0%",
                        "right": "0%",
                        "bottom": "0%",
                        "containLabel": true
                    },
                    "yAxis": {
                        "type": "value"
                    },
                    "series": [{
                        "data": [820, 932, 901, 934, 1290, 1330, 1320],
                        "type": "line",
                        "smooth": true
                    }]
                },
                // chatBar
                chatBar: {
                    "title": {
                        "text": "某站点用户访问来源",
                        "subtext": "纯属虚构",
                        "left": "center",
                        "end": ""
                    },
                    "color": ["#3398DB"],
                    "tooltip": {
                        "trigger": "axis",
                        "axisPointer": {
                            "type": "shadow"
                        }
                    },
                    "grid": {
                        "top": "0%",
                        "left": "0%",
                        "right": "0%",
                        "bottom": "0%",
                        "containLabel": true
                    },
                    "xAxis": [{
                        "type": "category",
                        "data": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
                        "axisTick": {
                            "alignWithLabel": true
                        }
                    }],
                    "yAxis": [{
                        "type": "value"
                    }],
                    "series": [{
                        "name": "直接访问",
                        "type": "bar",
                        "barWidth": "60%",
                        "data": [10, 52, 200, 334, 390, 330, 220]
                    }]
                }
                // srcviewsindexvueDataEnd

            }

        }
    };
</script>
<style>
    .srcviewsindexvuecssStart {}

    .u66n4ZP {
        display: flex;
        width: 194px;
        height: 683px;
        flex-direction: row;
        position: static;
        overflow-y: initial;
    }

    .uGp5b1M {
        width: 100%;
        height: 65px;
        color: rgb(61, 108, 135);
    }

    .u0dd63 {
        width: max-content;
        height: max-content;
        flex: auto;
    }

    .u98a49 {
        width: max-content;
        height: max-content;
        font-size: 46px;
    }

    .u76541 {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        width: max-content;
        height: 142px;
        flex-direction: row;
        flex-wrap: nowrap;
        margin-left: 546px;
    }

    .u6f2ce {
        width: 1218px;
    }

    .u4482e {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 1780px;
        flex-direction: row;
        display: flex;
        flex-direction: row;
        display: flex;
        width: 202px;
        height: 66px;
        flex-direction: row;
    }

    .u95242 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 188px;
        height: 89px;
        flex-direction: row;
        flex-wrap: wrap-reverse;
        background-color: rgb(32, 218, 214);
        position: absolute;
        top: 88px;
        left: 25px;
        box-sizing: border-box;
    }

    .ue9802 {
        font-size: 36px;
    }

    .u95241 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 188px;
        height: 89px;
        flex-direction: row;
        flex-wrap: wrap-reverse;
        background-color: rgb(32, 218, 214);
        position: absolute;
        top: 88px;
        left: 554px;
        box-sizing: border-box;
    }

    .u95243 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 188px;
        height: 89px;
        flex-direction: row;
        flex-wrap: wrap-reverse;
        background-color: rgb(32, 218, 214);
        position: absolute;
        top: 88px;
        left: 297px;
        box-sizing: border-box;
    }

    .u7b67a {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 1387px;
        height: 54px;
        flex-direction: row;
        position: absolute;
        top: 114px;
        left: 839px;
    }

    .ue22ad {
        width: 250px;
        font-size: 50px;
        width: 250px;
        font-size: 27px;
        margin-left: -145px;
        padding-left: 124px;
    }

    .gui-button {
        display: block;
        background-color: #409eff;
        color: #fff;
        font-size: 1em;
        box-sizing: border-box;
        margin-left: 76px;
        font-weight: 500;
        border-color: #409eff;
        line-height: 1;
        white-space: nowrap;
        cursor: pointer;
        border: 1px solid #dcdfe6;
        -webkit-appearance: none;
        text-align: center;
        outline: none;
        margin: 0;
        transition: 2.1s;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        padding-top: 0.8em;
        padding-left: 1.4em;
        padding-right: 1.4em;
        padding-bottom: 0.8em;
        border-top-left-radius: 0.3em;
        border-bottom-left-radius: 0.3em;
        border-top-right-radius: 0.3em;
        border-bottom-right-radius: 0.3em;
        display: block;
        flex-direction: row;
        background-color: #409eff;
        color: #fff;
        font-size: 1em;
        box-sizing: border-box;
        font-weight: 500;
        border-color: #409eff;
        line-height: 1;
        white-space: nowrap;
        cursor: pointer;
        border: 1px solid #dcdfe6;
        -webkit-appearance: none;
        text-align: center;
        outline: none;
        margin: 0;
        transition: 2.1s;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        padding-top: 0.8em;
        padding-left: 1.4em;
        padding-right: 1.4em;
        padding-bottom: 0.8em;
        border-top-left-radius: 0.3em;
        border-bottom-left-radius: 0.3em;
        border-top-right-radius: 0.3em;
        border-bottom-right-radius: 0.3em;
        display: flex;
        background-color: #409eff;
        color: #fff;
        font-size: 1em;
        box-sizing: border-box;
        font-weight: 500;
        border-color: #409eff;
        line-height: 1;
        white-space: nowrap;
        cursor: pointer;
        border: 1px solid #dcdfe6;
        -webkit-appearance: none;
        text-align: center;
        outline: none;
        margin: 0;
        transition: 2.1s;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        padding-top: 0.8em;
        padding-left: 1.4em;
        padding-right: 1.4em;
        padding-bottom: 0.8em;
        border-top-left-radius: 0.3em;
        border-bottom-left-radius: 0.3em;
        border-top-right-radius: 0.3em;
        border-bottom-right-radius: 0.3em;
        display: flex;
        flex-direction: row;
        font-size: 13px;
        box-sizing: border-box;
        background-color: #409eff;
        color: #fff;
        margin-left: 76px;
        font-weight: 500;
        border-color: #409eff;
        line-height: 1;
        white-space: nowrap;
        cursor: pointer;
        border: 1px solid #dcdfe6;
        -webkit-appearance: none;
        text-align: center;
        outline: none;
        margin: 0;
        transition: 2.1s;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        padding-top: 0.8em;
        padding-right: 1.4em;
        padding-bottom: 0.8em;
        border-top-left-radius: 0.3em;
        border-bottom-left-radius: 0.3em;
        border-top-right-radius: 0.3em;
        border-bottom-right-radius: 0.3em;
    }

    .uc7f8vi {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        height: 417px;
        flex-direction: row;
        position: absolute;
        list-style-type: none;
        font-size: 12px;
        color: rgb(51, 51, 51);
        text-align: start;
        padding-left: 15px;
        padding-top: 15px;
        padding-right: 15px;
        padding-bottom: 15px;
        top: 184px;
        left: 33px;
        background-color: rgb(255, 255, 255);
        margin-bottom: 20px;
        border-bottom-style: solid;
        border-bottom-color: rgb(232, 233, 231);
        border-bottom-width: 1px;
        border-top-style: solid;
        border-top-color: rgb(232, 233, 231);
        border-top-width: 1px;
        border-left-style: solid;
        border-left-color: rgb(232, 233, 231);
        border-left-width: 1px;
        border-right-style: solid;
        border-right-color: rgb(232, 233, 231);
        border-right-width: 1px;
    }

    .ucxaadn {
        display: flex;
        width: 49px;
        height: 47px;
        list-style-type: none;
        font-size: 18px;
        color: rgb(51, 51, 51);
        text-align: start;
        padding-bottom: 10px;
        margin-bottom: 15px;
        border-bottom-style: solid;
        border-bottom-color: rgb(232, 233, 231);
        border-bottom-width: 1px;
        line-height: 127px;
        font-weight: 700;
    }

    .ucglkda {
        display: block;
        width: 282px;
        height: max-content;
        list-style-type: none;
        color: rgb(51, 51, 51);
        text-align: start;
        padding-left: 0px;
        padding-top: 128px;
        padding-right: 0px;
        padding-bottom: 0px;
        top: -63px;
        left: 66px;
    }

    .uc245v6 {
        display: flex;
        align-items: center;
        position: relative;
        top: 0px;
        left: 0px;
        list-style-type: none;
        color: rgb(51, 51, 51);
        padding-left: 30px;
        line-height: 4px;
        margin-bottom: 3px;
        margin-top: 3px;
        right: 0px;
        bottom: 0px;
    }

    .ucsijiz {
        display: -webkit-box;
        list-style-type: none;
        font-size: 23px;
        color: rgb(51, 51, 51);
        padding-bottom: 3px;
        line-height: 36px;
        text-decoration-line: none;
        text-decoration-style: solid;
        text-decoration-color: rgb(51, 51, 51);
        word-break: break-all;
        text-overflow: ellipsis;
        overflow: hidden;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }

    .uQ3VtkV {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        width: 423px;
        height: 501px;
        flex-direction: row;
        position: absolute;
        top: 186px;
        left: 393px;
    }

    .u148b9 {
        width: 434px;
        height: 416px;
        text-align: left;
        box-sizing: border-box;
    }

    .u2d296 {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        width: 1345px;
        height: 301px;
        flex-direction: row;
        position: absolute;
        top: 297px;
        left: 835px;
    }

    .uce16e22 {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        width: 1052px;
        flex-direction: row;
        position: absolute;
        top: -76px;
    }

    .ubba7d {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 206px;
        height: 28px;
        flex-direction: row;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 247px;
        height: 28px;
        flex-direction: row;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 316px;
        height: 28px;
        flex-direction: row;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 287px;
        height: 28px;
        flex-direction: row;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 201px;
        height: 28px;
        flex-direction: row;
    }

    .u45e72 {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        color: rgb(179, 179, 179);
        margin-left: -11px;
    }

    .u7a5f3 {
        display: flex;
    }

    .u45e7223 {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        padding-left: 26px;
        color: rgb(179, 179, 179);
    }

    .unUaJ5K {
        color: rgba(179, 179, 179, 1);
    }

    .u7933e {
        width: 199px;
        margin-top: 28px;
    }

    .uccdcc {
        align-items: center;
        margin-top: 28px;
    }

    .u2b544 {
        width: 220px;
        margin-top: 28px;
    }

    .u17460 {
        width: 220px;
        margin-top: 28px;
    }

    .u118c8 {
        width: 180px;
        margin-top: 28px;
    }

    .ue79c9 {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        width: 2665px;
        height: 49px;
        flex-direction: row;
        position: absolute;
        overflow-y: auto;
        top: 262px;
        left: -2px;
    }

    .uADxijh {
        color: rgba(179, 179, 179, 1);
    }

    .uwUaDSt {
        padding-left: 84px;
    }

    .uE4rdaZ {
        color: rgba(179, 179, 179, 1);
    }

    .u3ftJNu {
        margin-left: 69px;
    }

    .uf7b02 {
        width: 704px;
        height: 297px;
        position: absolute;
        font-size: 15px;
        top: 636px;
        left: 29px;
    }

    .fenxi {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: max-content;
        height: max-content;
        flex-direction: row;
        position: absolute;
        top: -30px;
        left: 9px;
        box-sizing: border-box;
        flex-wrap: nowrap;
    }

    .u38b54 {
        display: block;
        width: 826px;
        height: 223px;
        position: absolute;
        top: 654px;
        left: 19px;
        padding-top: 6px;
    }

    .u8a48e {
        width: 570px;
        height: 260px;
        position: absolute;
        top: 603px;
        left: 828px;
    }

    .u8f3cf {
        width: 570px;
        height: 38px;
    }

    .ud5add {
        font-size: 27px;
    }

    .ud532f {
        width: 516px;
        height: 223px;
    }

    .uZXvl9C {
        height: 227px;
    }

    .u8a48e2 {
        width: 540px;
        height: 260px;
        position: absolute;
        top: 603px;
        left: 1434px;
    }

    .u8f3cf2 {
        width: 570px;
        height: 38px;
    }

    .gui-button:active {
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
        transform: scale(0.75);
        box-shadow: 0px 0px 0.1em 0.4em rgb(180, 179, 179);
    }

    .srcviewsindexvuecssEnd {}
</style>

// indexvueMountedStart

// indexvueMountedEnd
//importStart

import charts from '@/components/charts';
//importEnd
// indexvueDataStart

// indexvueDataEnd
// indexvueMethodStart

// indexvueMethodEnd
// srcviewszonghefenxiindexvueMountedStart

// srcviewszonghefenxiindexvueMountedEnd
// srcviewsindexvueMountedStart

// srcviewsindexvueMountedEnd